<template>
  <Dialog v-model="dialogVisible" title="参评人员审核" width="1000px">
    <el-form
      ref="formRef"
      :model="auditForm"
      :rules="auditRules"
      label-width="120px"
      v-loading="formLoading"
    >
      <!-- 基本信息 -->
      <el-divider content-position="left">基本信息</el-divider>
      <el-descriptions :column="2" border>
        <el-descriptions-item label="考生姓名">
          {{ candidateData.candidateName || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="身份证号">
          {{ candidateData.idCard || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="联系电话">
          {{ candidateData.phone || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="申报职业">
          {{ candidateData.professionName || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="申报等级">
          {{ getLevelName(candidateData.skillLevel) }}
        </el-descriptions-item>
        <el-descriptions-item label="工作单位">
          {{ candidateData.workUnit || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="工作年限">
          {{ candidateData.workYears || 0 }}年
        </el-descriptions-item>
        <el-descriptions-item label="申报时间">
          {{ candidateData.submitTime || '-' }}
        </el-descriptions-item>
      </el-descriptions>
      
      <!-- 材料清单 -->
      <el-divider content-position="left">申报材料</el-divider>
      <el-table :data="materialsList" border style="width: 100%; margin-bottom: 20px;">
        <el-table-column prop="materialName" label="材料名称" width="200" />
        <el-table-column prop="materialType" label="材料类型" width="120">
          <template #default="{ row }">
            <el-tag>{{ getMaterialTypeName(row.materialType) }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="isRequired" label="是否必需" width="100">
          <template #default="{ row }">
            <el-tag :type="row.isRequired ? 'danger' : 'info'">
              {{ row.isRequired ? '必需' : '可选' }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="submitStatus" label="提交状态" width="100">
          <template #default="{ row }">
            <el-tag :type="getSubmitStatusColor(row.submitStatus)">
              {{ getSubmitStatusName(row.submitStatus) }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="auditStatus" label="审核状态" width="100">
          <template #default="{ row }">
            <el-tag :type="getAuditStatusColor(row.auditStatus)">
              {{ getAuditStatusName(row.auditStatus) }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="fileName" label="文件名称" show-overflow-tooltip />
        <el-table-column label="操作" width="120">
          <template #default="{ row }">
            <el-button 
              v-if="row.submitStatus === 1" 
              link 
              type="primary" 
              size="small"
              @click="previewFile(row)"
            >
              预览
            </el-button>
            <el-button 
              v-if="row.submitStatus === 1" 
              link 
              type="primary" 
              size="small"
              @click="downloadFile(row)"
            >
              下载
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      
      <!-- 审核表单 -->
      <el-divider content-position="left">审核结果</el-divider>
      <el-form-item label="审核结果" prop="auditResult">
        <el-radio-group v-model="auditForm.auditResult">
          <el-radio :value="1">审核通过</el-radio>
          <el-radio :value="2">审核不通过</el-radio>
          <el-radio :value="3">需要补充材料</el-radio>
        </el-radio-group>
      </el-form-item>
      
      <el-form-item 
        label="不通过原因" 
        prop="rejectReason" 
        v-if="auditForm.auditResult === 2"
      >
        <el-checkbox-group v-model="auditForm.rejectReason">
          <el-checkbox label="identity">身份信息不符</el-checkbox>
          <el-checkbox label="qualification">学历资格不符</el-checkbox>
          <el-checkbox label="experience">工作经验不足</el-checkbox>
          <el-checkbox label="materials">材料不完整</el-checkbox>
          <el-checkbox label="fake">材料造假</el-checkbox>
          <el-checkbox label="other">其他原因</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      
      <el-form-item 
        label="需补充材料" 
        prop="requiredMaterials" 
        v-if="auditForm.auditResult === 3"
      >
        <el-checkbox-group v-model="auditForm.requiredMaterials">
          <el-checkbox label="idCard">身份证</el-checkbox>
          <el-checkbox label="diploma">学历证书</el-checkbox>
          <el-checkbox label="workCert">工作证明</el-checkbox>
          <el-checkbox label="skillCert">技能证书</el-checkbox>
          <el-checkbox label="photo">照片</el-checkbox>
          <el-checkbox label="other">其他材料</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      
      <el-form-item label="审核说明" prop="auditComments">
        <el-input
          v-model="auditForm.auditComments"
          type="textarea"
          :rows="4"
          placeholder="请输入审核说明"
        />
      </el-form-item>
      
      <el-form-item label="审核人员" prop="auditor">
        <el-input v-model="auditForm.auditor" placeholder="审核人员" readonly />
      </el-form-item>
    </el-form>
    
    <!-- 审核历史 -->
    <el-divider content-position="left" v-if="auditHistory.length > 0">
      审核历史
    </el-divider>
    <el-timeline v-if="auditHistory.length > 0">
      <el-timeline-item
        v-for="(record, index) in auditHistory"
        :key="index"
        :timestamp="record.auditTime"
        :type="getHistoryType(record.auditResult)"
      >
        <el-card>
          <h4>{{ getAuditResultName(record.auditResult) }}</h4>
          <p><strong>审核人：</strong>{{ record.auditor }}</p>
          <p v-if="record.auditComments"><strong>审核说明：</strong>{{ record.auditComments }}</p>
          <p v-if="record.rejectReason && record.rejectReason.length > 0">
            <strong>不通过原因：</strong>{{ formatRejectReason(record.rejectReason) }}
          </p>
        </el-card>
      </el-timeline-item>
    </el-timeline>
    
    <template #footer>
      <el-button @click="submitAudit" type="primary" :loading="formLoading">提交审核</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const emit = defineEmits(['success'])
const dialogVisible = ref(false)
const formLoading = ref(false)
const formRef = ref()

const candidateData = ref({} as any)
const auditForm = ref({
  candidateId: '',
  auditResult: undefined,
  rejectReason: [] as string[],
  requiredMaterials: [] as string[],
  auditComments: '',
  auditor: '当前用户'
})

const auditRules = ref({
  auditResult: [{ required: true, message: '请选择审核结果', trigger: 'change' }],
  rejectReason: [
    { 
      validator: (rule: any, value: string[], callback: Function) => {
        if (auditForm.value.auditResult === 2 && (!value || value.length === 0)) {
          callback(new Error('请选择不通过原因'))
        } else {
          callback()
        }
      }, 
      trigger: 'change' 
    }
  ],
  requiredMaterials: [
    { 
      validator: (rule: any, value: string[], callback: Function) => {
        if (auditForm.value.auditResult === 3 && (!value || value.length === 0)) {
          callback(new Error('请选择需要补充的材料'))
        } else {
          callback()
        }
      }, 
      trigger: 'change' 
    }
  ],
  auditComments: [{ required: true, message: '审核说明不能为空', trigger: 'blur' }]
})

// 材料清单
const materialsList = ref([
  {
    materialName: '身份证',
    materialType: 1,
    isRequired: true,
    submitStatus: 1,
    auditStatus: 0,
    fileName: '张三_身份证.jpg'
  },
  {
    materialName: '学历证书',
    materialType: 2,
    isRequired: true,
    submitStatus: 1,
    auditStatus: 0,
    fileName: '张三_学历证书.pdf'
  },
  {
    materialName: '工作证明',
    materialType: 3,
    isRequired: true,
    submitStatus: 0,
    auditStatus: 0,
    fileName: ''
  },
  {
    materialName: '技能证书',
    materialType: 4,
    isRequired: false,
    submitStatus: 1,
    auditStatus: 0,
    fileName: '张三_技能证书.jpg'
  }
])

// 审核历史
const auditHistory = ref([
  {
    auditTime: '2023-12-01 10:00:00',
    auditResult: 3,
    auditor: '李审核员',
    auditComments: '需要补充工作证明材料',
    rejectReason: []
  }
])

const getLevelName = (level: number) => {
  const levelMap = { 1: '初级', 2: '中级', 3: '高级', 4: '技师', 5: '高级技师' }
  return levelMap[level] || '-'
}

const getMaterialTypeName = (type: number) => {
  const typeMap = { 1: '身份证件', 2: '学历证书', 3: '工作证明', 4: '技能证书', 5: '其他材料' }
  return typeMap[type] || '-'
}

const getSubmitStatusName = (status: number) => {
  const statusMap = { 0: '未提交', 1: '已提交' }
  return statusMap[status] || '-'
}

const getSubmitStatusColor = (status: number) => {
  const colorMap = { 0: 'danger', 1: 'success' }
  return colorMap[status] || 'info'
}

const getAuditStatusName = (status: number) => {
  const statusMap = { 0: '待审核', 1: '审核通过', 2: '审核不通过' }
  return statusMap[status] || '-'
}

const getAuditStatusColor = (status: number) => {
  const colorMap = { 0: 'warning', 1: 'success', 2: 'danger' }
  return colorMap[status] || 'info'
}

const getAuditResultName = (result: number) => {
  const resultMap = { 1: '审核通过', 2: '审核不通过', 3: '需要补充材料' }
  return resultMap[result] || '-'
}

const getHistoryType = (result: number) => {
  const typeMap = { 1: 'success', 2: 'danger', 3: 'warning' }
  return typeMap[result] || 'primary'
}

const formatRejectReason = (reasons: string[]) => {
  const reasonMap = {
    identity: '身份信息不符',
    qualification: '学历资格不符',
    experience: '工作经验不足',
    materials: '材料不完整',
    fake: '材料造假',
    other: '其他原因'
  }
  return reasons.map(r => reasonMap[r] || r).join('、')
}

const previewFile = (row: any) => {
  // TODO: 实现文件预览
  console.log('预览文件:', row)
}

const downloadFile = (row: any) => {
  // TODO: 实现文件下载
  console.log('下载文件:', row)
}

const submitAudit = async () => {
  const elForm = formRef.value
  if (!elForm) return
  const valid = await elForm.validate()
  if (!valid) return
  
  formLoading.value = true
  try {
    // TODO: 提交审核结果
    console.log('提交审核:', auditForm.value)
    dialogVisible.value = false
    emit('success')
  } finally {
    formLoading.value = false
  }
}

const resetForm = () => {
  auditForm.value = {
    candidateId: '',
    auditResult: undefined,
    rejectReason: [],
    requiredMaterials: [],
    auditComments: '',
    auditor: '当前用户'
  }
  if (formRef.value) {
    formRef.value.clearValidate()
  }
}

const open = (data: any) => {
  dialogVisible.value = true
  candidateData.value = data
  auditForm.value.candidateId = data.id
  resetForm()
}

defineExpose({ open })
</script> 